<template>
	<view class="album ">
		 <fui-tabs :tabs="changetabs" @change="imagechange" selectedColor='#35743D' sliderBackground='#35743D'></fui-tabs>
		<view>
			<fui-row>
				<fui-col :span="24" v-for="(ite,index) in list" :key='index'>
					<image :src="baseOssUrl2 + ite" class="" mode="aspectFill" ></image>
				</fui-col> 
			</fui-row>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import {
		baseOssUrl,
		baseOssUrl2
	} from '@/common/settings';
	export default {
		data() {
			return {
				baseOssUrl: baseOssUrl,
				baseOssUrl2: baseOssUrl2,
				mId:'',
				changetabs: [{
						//标签显示文本（String）
						name: '外观'
					}, {
						name: '客房'
					}, {
						name: '餐饮',
					}, {
						name: '休闲'
					},
					{
						name: '大厅'
					}
				],
        arrData: [],
				isImages: 0,
        list: []
			}
		},
		onLoad(op) {
			this.mId = op.id
			this.getMerchantInfo()
		},
		methods: {
			imagechange(e) {
				this.isImages = e.index;
				this.list = this.arrData[this.arrData.findIndex(item => item.type == e.index)].arr.split(',');
			},
			// 获取轮播图
			getMerchantInfo() {
				this.$http.post(this.$httpApi.merchantInfo, {
					data: {
						id: this.mId,
					}
				}).then(res => {
					if (res.code == 0) {
						this.arrData = JSON.parse(res.merchant.storeImages)
            this.imagechange({index: 0});
					}
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.album {
		height: 100%;
		
		/deep/.fui-col {
			text-align: center!important;
			margin-top: 20rpx;
		}

		image {
			width: 100%;
		}
	}
</style>
